<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Libra - Law Firm Bootstrap 5 HTML Template</title>
    <!-- Favicons -->
    <link rel="shortcut icon" href="assets/images/favicon.ico">


    <!-- Vendor CSS (Icon Font) -->


    <link rel="stylesheet" href="assets/css/vendor/icofont.min.css">
    <link rel="stylesheet" href="assets/css/vendor/themify-icons.min.css">


    <!-- Plugins CSS (All Plugins Files) -->


    <link rel="stylesheet" href="assets/css/plugins/animate.min.css" />
    <link rel="stylesheet" href="assets/css/plugins/jquery-ui.min.css" />
    <link rel="stylesheet" href="assets/css/plugins/aos.min.css" />
    <link rel="stylesheet" href="assets/css/plugins/swiper-bundle.min.css" />
    <link rel="stylesheet" href="assets/css/plugins/slick.css" />


    <!-- Main Style CSS -->


    <link rel="stylesheet" href="assets/css/style.css" />



    <!-- Use the minified version files listed below for better performance and remove the files listed above -->



    <!-- 
    <link rel="stylesheet" href="assets/css/vendor.min.css">
    <link rel="stylesheet" href="assets/css/plugins.min.css">
    <link rel="stylesheet" href="assets/css/style.min.css">  
    -->
</head>

<body>
    <!-- Header Section Start -->
    <div class="header">

        <!-- Header Top Start -->
        <div class="container">
            <div class="header-top">
                <div class="row mb-n2">
                    <div class="col-md-6 col-12 mb-2">
                        <!-- Header Top left Start -->
                        <div class="header-top-left">
                            <div class="text">Your address goes here</div>
                        </div>
                        <!-- Header Top left End -->
                    </div>
                    <div class="col-md-6 col-12 mb-2">
                        <!-- Header Top Right Start -->
                        <div class="header-top-right">
                            <ul class="info-list">
                                <li><a href="mailto:demo@example.com"> demo@example.com</a></li>
                                <li><a href="tel:+001-2345-67-89">+001 2345 67 89</a></li>
                            </ul>
                        </div>
                        <!-- Header Top Right End -->
                    </div>
                </div>
            </div>
        </div>
        <!-- Header Top End -->

        <!-- Header Wrapper Start -->
        <div class="header-wrapper">
            <div class="header-sticky">
                <div class="container">
                    <div class="row align-items-center">

                        <div class="col-lg-3 col-md-6 col-6">
                            <!-- Header Logo Start -->
                            <div class="header-logo">
                                <a href="index.html">
                                    <img class="fit-image" src="assets/images/logo/logo.png" alt="Header Logo">
                                </a>
                            </div>
                            <!-- Header Logo End -->

                        </div>

                        <div class="col-lg-6 d-none d-lg-block">

                            <!-- Main Menu Language Wrapper Start -->
                            <div class="main-menu-language-wrapper">

                                <!-- Main Menu Start -->
                                <nav class="main-menu">
                                    <ul>
                                        <li>
                                            <a class="active" href="index.html">Home</a>
                                        </li>
                                        <li>
                                            <a href="#">Service</a>
                                            <ul class="submenu">
                                                <li><a href="service.html">Service</a></li>
                                                <li><a href="single-service.html">Single Service</a></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a href="#">Blog</a>
                                            <ul class="submenu">
                                                <li><a href="blog.html">Blog</a></li>
                                                <li><a href="blog-details.html">Blog Details</a></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a href="about.html">About</a>
                                        </li>
                                        <li>
                                            <a href="contact.html">Contact</a>
                                        </li>
                                    </ul>
                                </nav>
                                <!-- Main Menu End -->

                            </div>
                            <!-- Main Menu Language Wrapper End -->

                        </div>

                        <div class="col-lg-3 col-md-6 col-6">

                            <!-- Social Media Link Start -->
                            <div class="social-media-link">
                                <a href="#"><i class="icofont-twitter"></i></a>
                                <a href="#"><i class="icofont-facebook"></i></a>
                                <a href="#"><i class="icofont-behance"></i></a>
                            </div>
                            <!-- Social Media Link End -->

                            <!-- Mobile Menu Hamburger Start -->
                            <div class="mobile-menu-hamburger">
                                <a href="javascript:void(0)">
                                    <span>Menu</span>
                                    <i class="icon icofont-navigation-menu"></i>
                                </a>
                            </div>
                            <!-- Mobile Menu Hamburger End -->

                        </div>

                    </div>
                </div>
            </div>
        </div>
        <!-- Header Top End -->

        <!-- Mobile Menu Start -->
        <div class="mobile-menu-wrapper">
            <div class="offcanvas-overlay"></div>

            <!-- Mobile Menu Inner Start -->
            <div class="mobile-menu-inner">
                <!-- Mobile Menu Inner Top Start -->
                <div class="mobile-menu-inner-top">

                    <!-- Mobile Menu Logo Start  -->
                    <div class="logo-mobile">
                        <img src="assets/images/logo/logo.png" alt="Logo">
                    </div>
                    <!-- Mobile Menu Logo End -->

                    <!-- Button Close Start -->
                    <div class="offcanvas-btn-close">
                        <i class="icofont-close-line"></i>
                    </div>
                    <!-- Button Close End -->

                </div>
                <!-- Mobile Menu Inner Top End -->

                <!-- Mobile Menu Start -->
                <div class="mobile-navigation">
                    <nav>
                        <ul class="mobile-menu">
                            <li class="has-children">
                                <a href="index.html">Home</a>
                            </li>
                            <li class="has-children">
                                <a href="#">Servcie <i class="icofont-rounded-down" aria-hidden="true"></i></a>
                                <ul class="dropdown">
                                    <li><a href="service.html">Service</a></li>
                                    <li><a href="single-service.html">Single Service</a></li>
                                </ul>
                            </li>
                            <li class="has-children">
                                <a href="#">Blog <i class="icofont-rounded-down" aria-hidden="true"></i></a>
                                <ul class="dropdown">
                                    <li><a href="blog.html">Blog</a></li>
                                    <li><a href="blog-details.html">Blog Details</a></li>
                                </ul>
                            </li>
                            <li><a href="about.html">About</a></li>
                            <li><a href="contact.html">Contact</a></li>
                        </ul>
                    </nav>
                </div>
                <!-- Mobile Menu End -->
            </div>
            <!-- Mobile Menu Inner End -->
        </div>
        <!-- Mobile Menu End -->

    </div>
    <!-- Header Section End -->

    <!-- Single Service Section Bg Start -->
    <div class="section single-service-section-bg bg-overlay">
        <div class="container">
            <div class="row">
                <div class="col-12">

                    <!-- Service Section Title Start -->
                    <div class="service-section-title text-center" data-aos="zoom-in" data-aos-delay="200">
                        <h4 class="subtitle">Our Services</h4>
                        <h1 class="title">Banks & Financials</h1>
                        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod
                            tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
                    </div>
                    <!-- Service Section Title End -->

                </div>
            </div>
        </div>
    </div>
    <!-- Single Service Section Bg End -->

    <!-- Service Sidebar Section Start -->
    <div class="section section-padding">
        <div class="container">
            <div class="row mb-n10">

                <!-- Service Content Side Start -->
                <div class="content-side col-lg-9 col-md-12 mb-10">
                    <div class="service-detail">
                        <div class="inner-box">
                            <p>We work closely with Employers across all industry sectors to ensure that their internal
                                sed Human Resource systems processes align to their business requirements idea of
                                denouncing pleasure and praising pain was born and I will give you a complete account of
                                the system, and expound the great explorer of the truth.</p>
                            <p>Take a 360-degree sed view of yours situations using our seds deep experience, industries
                                specialization and global reach ensure that their internal sed Human Resource systems
                                processes align to their business requirements idea of denouncing pleasure and praising
                                pain was born and I will give you a complete account of the system, and expound the
                                actual teachings ensure that their internal sed Human Resource systems processes align
                                to their business requirements ut idea of denouncing pleasure.</p>
                            <div class="tag-text" data-aos="fade-up" data-aos-delay="200">“An average heart beats
                                100,000 times a day, pumping some 2,000 gallons”</div>
                            <div class="two-column overflow-hidden">
                                <div class="row clearfix">
                                    <!-- Column -->
                                    <div class="column col-lg-6 col-md-6 col-sm-12" data-aos="fade-right"
                                        data-aos-delay="200">
                                        <h3 class="title">Consulation</h3>
                                        <ul class="service-list">
                                            <li>Colonoscopy<span>$250</span></li>
                                            <li>Gastroscopy<span>$540</span></li>
                                            <li>Allergy testing<span>$95</span></li>
                                            <li>CT scan<span>$1,200</span></li>
                                        </ul>
                                    </div>
                                    <!-- Column -->
                                    <div class="column col-lg-6 col-md-6 col-sm-12" data-aos="fade-left"
                                        data-aos-delay="200">
                                        <h3 class="title">Personal</h3>
                                        <ul class="service-list">
                                            <li>Colonoscopy<span>$250</span></li>
                                            <li>Gastroscopy<span>$540</span></li>
                                            <li>Allergy testing<span>$95</span></li>
                                            <li>CT scan<span>$1,200</span></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <h3 class="title">Our Lawyers</h3>
                            <div class="lawyer-gallery">
                                <div class="row clearfix">
                                    <!-- Lawyer Column -->
                                    <div class="lawyer-column col-lg-4 col-md-4 col-sm-6" data-aos="fade-up"
                                        data-aos-delay="200">
                                        <div class="image">
                                            <img class="fit-image" src="assets/images/team/1.jpg" alt="Team Image">
                                        </div>
                                    </div>
                                    <!-- Lawyer Column -->
                                    <div class="lawyer-column col-lg-4 col-md-4 col-sm-6" data-aos="fade-up"
                                        data-aos-delay="400">
                                        <div class="image">
                                            <img class="fit-image" src="assets/images/team/2.jpg" alt="Team Image">
                                        </div>
                                    </div>
                                    <!-- Lawyer Column -->
                                    <div class="lawyer-column col-lg-4 col-md-4 col-sm-6" data-aos="fade-up"
                                        data-aos-delay="600">
                                        <div class="image">
                                            <img class="fit-image" src="assets/images/team/3.jpg" alt="Team Image">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <h3 class="title">Frequently Ask Questions</h3>

                            <div class="faq-accordion-wrapper accordion" id="accordionExample" data-aos="fade-up"
                                data-aos-delay="200">
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingOne">
                                        <button class="accordion-button" type="button" data-bs-toggle="collapse"
                                            data-bs-target="#collapseOne" aria-expanded="true"
                                            aria-controls="collapseOne">Can I Get A Divorce Without A Lawyer?</button>
                                    </h2>
                                    <div id="collapseOne" class="accordion-collapse collapse show"
                                        aria-labelledby="headingOne" data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur
                                                consectetur elit lacinia ornare. In volutpat rutrum molestie. Vivamus
                                                efficitur orci, ac gravida eros bibendum non. Nullam auctor varius fer
                                                Vestibulum ante ipsum primis in faucibus orci luctus et ultrices.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingTwo">
                                        <button class="accordion-button collapsed" type="button"
                                            data-bs-toggle="collapse" data-bs-target="#collapseTwo"
                                            aria-expanded="false" aria-controls="collapseTwo">I Have A Technical Problem
                                            Or Support Issue I Need Resolved, Who Do I Email?</button>
                                    </h2>
                                    <div id="collapseTwo" class="accordion-collapse collapse"
                                        aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur
                                                consectetur elit lacinia ornare. In volutpat rutrum molestie. Vivamus
                                                efficitur orci, ac gravida eros bibendum non. Nullam auctor varius fer
                                                Vestibulum ante ipsum primis in faucibus orci luctus et ultrices.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingThree">
                                        <button class="accordion-button collapsed" type="button"
                                            data-bs-toggle="collapse" data-bs-target="#collapseThree"
                                            aria-expanded="false" aria-controls="collapseThree">What Other Services Are
                                            You Compatible With?</button>
                                    </h2>
                                    <div id="collapseThree" class="accordion-collapse collapse"
                                        aria-labelledby="headingThree" data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur
                                                consectetur elit lacinia ornare. In volutpat rutrum molestie. Vivamus
                                                efficitur orci, ac gravida eros bibendum non. Nullam auctor varius fer
                                                Vestibulum ante ipsum primis in faucibus orci luctus et ultrices.</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingFour">
                                        <button class="accordion-button collapsed" type="button"
                                            data-bs-toggle="collapse" data-bs-target="#collapseFour"
                                            aria-expanded="false" aria-controls="collapseFour">Are You Hiring?</button>
                                    </h2>
                                    <div id="collapseFour" class="accordion-collapse collapse"
                                        aria-labelledby="headingFour" data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur
                                                consectetur elit lacinia ornare. In volutpat rutrum molestie. Vivamus
                                                efficitur orci, ac gravida eros bibendum non. Nullam auctor varius fer
                                                Vestibulum ante ipsum primis in faucibus orci luctus et ultrices.</p>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <a href="blog.html" class="questions">View All Questions</a>

                        </div>
                    </div>
                </div>
                <!-- Service Content Side End -->

                <!-- Service Side Start -->
                <div class="sidebar-side col-lg-3 col-md-12 mb-10">
                    <aside class="sidebar sticky-top">

                        <!-- Categories Widget -->
                        <div class="sidebar-widget categories-widget" data-aos="fade-up" data-aos-delay="200">
                            <div class="widget-content">
                                <div class="sidebar-title">
                                    <h3 class="title">Our Services</h3>
                                </div>
                                <ul class="service-cat">
                                    <li class="active"><a href="service.html">Personal Injury</a></li>
                                    <li><a href="service.html">family law</a></li>
                                    <li><a href="service.html">capital market</a></li>
                                    <li><a href="service.html">employment law</a></li>
                                    <li><a href="service.html">house &amp; estate litigation</a></li>
                                    <li><a href="service.html">criminal law</a></li>
                                </ul>
                            </div>
                        </div>

                        <!-- Reservations Widget -->
                        <div class="sidebar-widget reservation-widget" data-aos="fade-up" data-aos-delay="400">
                            <div class="widget-content">
                                <div class="sidebar-title">
                                    <h3 class="title">Reservations</h3>
                                </div>

                                <!-- Reservation Form -->
                                <div class="reservation-form">
                                    <!-- Reservation Form -->
                                    <form method="post" action="contact.html">

                                        <div class="form-group">
                                            <input type="text" name="name" placeholder="Your Name" required="">
                                        </div>

                                        <div class="form-group">
                                            <input type="email" name="email" placeholder="Email Address" required="">
                                        </div>

                                        <div class="form-group">
                                            <input type="text" name="phone" placeholder="Phone Number" required="">
                                        </div>

                                        <div class="form-group">
                                            <span class="icon icofont-calendar"></span>
                                            <input class="datepicker hasDatepicker" type="text" name="appointment"
                                                placeholder="Appointment Date">
                                        </div>

                                        <div class="form-group">
                                            <textarea name="message" placeholder="Here goes your message"></textarea>
                                        </div>

                                        <div class="form-group">
                                            <button class="btn btn-primary btn-hover-whited w-100" type="submit"
                                                name="submit-form"><span class="txt">send message</span></button>
                                        </div>

                                    </form>

                                </div>
                                <!-- End Consulation Form -->

                            </div>
                        </div>

                    </aside>
                </div>
                <!-- Service Side End -->
            </div>
        </div>
    </div>
    <!-- Service Sidebar Section End -->

    <!-- Cta Section Start -->
    <div class="section cta-bg overflow-hidden">
        <!-- Cta Content Start -->
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <!-- Booking Content Number Start -->
                    <div class="booking-content-number">
                        <!-- Booking Content Start -->
                        <div class="booking-content" data-aos="fade-right" data-aos-delay="500">
                            <h1 class="title">Book an appoitment quickly? <a href="tel:+0123-45-67-890">Call us now!</a>
                            </h1>
                            <p>We prodive a dedicated support 24/7 for any your question</p>
                        </div>
                        <!-- Booking Content End -->

                        <!-- Contact Number Start -->
                        <div class="contact-number" data-aos="fade-left" data-aos-delay="500">
                            <a href="tel:+0123-45-67-890">+0123-45-67-890</a>
                        </div>
                        <!-- Contact Number End -->
                    </div>
                    <!-- Booking Content Number End -->
                </div>
            </div>
        </div>
        <!-- Cta Content End -->
    </div>
    <!-- Cta Section End -->

    <!-- Main Footer -->
    <footer class="section main-footer bg-clouded">
        <div class="container">
            <!--Widgets Section-->
            <div class="widgets-section section-padding">
                <div class="row clearfix mb-n8">

                    <!-- Column -->
                    <div class="big-column col-lg-6 col-md-12 col-sm-6 col-12 mb-8">
                        <div class="row clearfix mb-n6">

                            <!-- Footer Column -->
                            <div class="footer-column col-lg-6 col-md-6 col-sm-12 mb-6">
                                <div class="footer-widget logo-widget">
                                    <div class="logo">
                                        <a href="index.html"><img src="assets/images/logo/logo.png"
                                                alt="Footer Logo" /></a>
                                    </div>
                                    <div class="call">
                                        <span> Call us directly</span>
                                        <a class="phone" href="tel:+1-234-567-8910">+1 234-567-8910</a>
                                        <a class="email" href="mailto:demo@example.com">demo@example.com</a>
                                    </div>
                                </div>
                            </div>

                            <!-- Footer Column -->
                            <div class="footer-column col-lg-6 col-md-6 col-sm-12 mb-6">
                                <div class="footer-widget links-widget">
                                    <h5 class="title">Company</h5>
                                    <ul class="list-link">
                                        <li><a href="about.html">About Us</a></li>
                                        <li><a href="about.html">Team</a></li>
                                        <li><a href="about.html">Careers</a></li>
                                        <li><a href="about.html">Investors</a></li>
                                        <li><a href="contact.html">Contact Us</a></li>
                                        <li><a href="about.html">Offices</a></li>
                                    </ul>
                                </div>
                            </div>

                        </div>
                    </div>

                    <!-- Column -->
                    <div class="big-column col-lg-6 col-md-12 col-sm-6 col-12 mb-8">
                        <div class="row clearfix mb-n6">

                            <!-- Footer Column -->
                            <div class="footer-column col-lg-6 col-md-6 col-sm-12 mb-6">
                                <div class="footer-widget links-widget">
                                    <h5 class="title">Quick Links</h5>
                                    <ul class="list-link">
                                        <li><a href="contact.html">FAQS</a></li>
                                        <li><a href="contact.html">Support</a></li>
                                        <li><a href="contact.html">Sitemap</a></li>
                                        <li><a href="contact.html">Community</a></li>
                                        <li><a href="contact.html">Location</a></li>
                                        <li><a href="contact.html">Address</a></li>
                                    </ul>
                                </div>
                            </div>

                            <!-- Footer Column -->
                            <div class="footer-column col-lg-6 col-md-6 col-sm-12 mb-6">
                                <div class="footer-widget newsletter-widget">
                                    <h5 class="title">Our Newsletter</h5>
                                    <div class="text">Subscribe to our newsletter and we will inform you about latest
                                        updates and offers</div>
                                    <!-- Newsletter Form -->
                                    <div class="newsletter-form">
                                        <form method="post" action="contact.html">
                                            <div class="form-group">
                                                <input type="email" name="email" value="" placeholder="Email Address..."
                                                    required>
                                                <button type="submit" class="theme-btn icofont-arrow-right"></button>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>

                </div>
            </div>

            <!-- Footer Bottom -->
            <div class="footer-bottom">
                <div class="auto-container">
                    <div class="bottom-inner">
                        <div class="row clearfix mb-n6">

                            <!-- Copyright Start -->
                            <div class="col-md-8 col-sm-12 mb-6">© 2025 - All Rights Reserved. <a target="_blank"
                                    href="https://www.mobanwang.com/" title="网站模板">网站模板</a></div>
                            <!-- Copyright End -->

                            <!-- Footer Social nav Start -->
                            <div class="col-md-4 col-sm-12 mb-6">
                                <ul class="social-nav">
                                    <li><a href="#" class="icofont-twitter"></a></li>
                                    <li><a href="#" class="icofont-facebook"></a></li>
                                    <li><a href="#" class="icofont-instagram"></a></li>
                                    <li><a href="#" class="icofont-rss"></a></li>
                                    <li><a href="#" class="icofont-play-alt-1"></a></li>
                                </ul>
                            </div>
                            <!-- Footer Social nav End -->

                        </div>
                    </div>
                </div>
            </div>

        </div>
    </footer>
    <!-- End Main Footer -->

    <!-- Scroll Top Start -->
    <a href="#" class="scroll-top" id="scroll-top">
        <i class="arrow-top ti-arrow-up"></i>
        <i class="arrow-bottom ti-arrow-up"></i>
    </a>
    <!-- Scroll Top End -->

    <!-- Preloader Start -->
    <div id="preloader">
        <div class="preloader">
            <div class="spinner-border text-primary"></div>
        </div>
    </div>
    <!-- Preloader End -->

    <!-- Scripts -->
    <!-- Global Vendor, plugins JS -->

    <!-- Vendor JS -->
    <script src="assets/js/vendor/popper.min.js"></script>
    <script src="assets/js/vendor/bootstrap.min.js"></script>
    <script src="assets/js/vendor/jquery-3.5.1.min.js"></script>
    <script src="assets/js/vendor/jquery-migrate-3.3.0.min.js"></script>
    <script src="assets/js/vendor/modernizr-3.11.2.min.js"></script>


    <!-- Plugins JS -->
    <!-- <script src="assets/js/plugins/appear.js"></script> -->
    <script src="assets/js/plugins/jquery.ajaxchimp.min.js"></script>
    <script src="assets/js/plugins/jquery-ui.min.js"></script>
    <script src="assets/js/plugins/swiper-bundle.min.js"></script>
    <script src="assets/js/plugins/slick.min.js"></script>
    <script src="assets/js/plugins/aos.min.js"></script>

    <!-- Use the minified version files listed below for better performance and remove the files listed above -->


    <!-- 
<script src="assets/js/vendor.min.js"></script>
<script src="assets/js/plugins.min.js"></script> 
-->



    <!--Main JS-->
    <script src="assets/js/main.js"></script>
</body>

</html>
